<!--网点维修受理页面-->
<template>
  <div>
    <!--查询条件区域-->
    <div>
      <el-form :inline="true">
        <!--总部管理员账号时显示-->
        <el-form-item v-if="roleType === '1'">
          <el-select v-model="searchDto.provinceCode" clearable placeholder="请选择省份"
                     @change="getSelectCity()">
            <el-option
              v-for="item in allSelectProvince"
              :key="item.code"
              :label="item.name"
              :value="item.code">
            </el-option>
          </el-select>
        </el-form-item>
        <!--总部账号管理员账号、办事处为省办事处、省外包商时显示-->
        <el-form-item v-if="roleType === '1' || (roleType === '2' && officeType === '0') || (roleType ==='3' &&
        outSource === '1') ">
          <el-select v-model="searchDto.cityCode" clearable placeholder="请选择地市">
            <el-option
              v-for="item in allSelectCity"
              :key="item.code"
              :label="item.name"
              :value="item.code">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-select v-model="searchDto.modelId" clearable placeholder="型号">
            <el-option
              v-for="item in changeModelOptions"
              :key="item.id"
              :label="item.code"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-select v-model="searchDto.customerType" clearable placeholder="客户类型">
            <el-option
              v-for="item in customerTypeOptions"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item size="5">
          <el-input placeholder="客户姓名" v-model="searchDto.customerName"></el-input>
        </el-form-item>
        <el-form-item size="5">
          <el-select v-model="searchDto.status" clearable placeholder="状态">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item size="5">
          <el-input placeholder="YSTSN" v-model="searchDto.YSTSN">
            <template slot="append">
              <el-button @click="searchDeviceStatus(searchDto.YSTSN)">查看设备维修状态</el-button>
            </template>
          </el-input>
        </el-form-item>
        <el-form-item size="5">
          <el-input placeholder="STBID" v-model="searchDto.STBID"></el-input>
        </el-form-item>
        <el-form-item>
          <el-date-picker
            v-model="searchDto.dateSearch"
            placeholder="选择受理日期"
            value-format="yyyy-MM-dd"
            format="yyyy 年 MM 月 dd 日"
            type="date"
            :picker-options="pickOption"></el-date-picker>
        </el-form-item>
        <!--当权限为省级办事处时，范围为自身办事处及该省内所有办事处、外包商-->
        <el-form-item>
          <el-select v-model="pointInformation" v-if="officeType === '0'">
            <el-option
              v-for="item in rangeOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="getAcceptOrderList()">查询</el-button>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="handleAdd()" v-show="this.orderFlag == true">新增</el-button>
        </el-form-item>
        <el-form-item>
          <el-dropdown @command="handleCommand">
            <el-button type="primary" v-show="this.orderFlag == true">导入<i
              class="el-icon-arrow-down el-icon--right"></i>
            </el-button>
            <el-dropdown-menu slot="dropdown">
              <!--<a href="/static/受理导入模板.xlsx"-->
              <!--download="受理导入模板.xlsx"-->
              <!--style="color:#5a5e66;text-decoration: none ">-->
              <!--<el-dropdown-item command="handleDownload">受理模板下载-->
              <!--</el-dropdown-item>-->
              <!--</a>-->
              <a href="/static/受理完整导入模板.xlsx"
                 download="受理完整导入模板.xlsx"
                 style="color:#5a5e66;text-decoration: none ">
                <el-dropdown-item command="handleDownload">完整模板下载
                </el-dropdown-item>
              </a>
              <!--<el-dropdown-item command="handleImport">受理导入</el-dropdown-item>-->
              <el-dropdown-item command="handleImportComplete">完整模板导入</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" v-show="this.baseorderFlag" @click="excelExport()">数据导出</el-button>
        </el-form-item>
      </el-form>
    </div>
    <!--一览显示区域-->
    <custom-table
      :columns="columns"
      :data="acceptOrderList"
      :tableLoadingFlag="tableLoadingFlag"
      :operationColumn="operationColumn"
      :pagination="pagination">
    </custom-table>
    <!-- 受理模板导入模态框 -->
    <el-dialog title="模板导入" :visible.sync="uploadVisible"
               :close-on-click-modal="false">
      <div>
        <el-form label-width="80px" ref="uploadForm" :inline="true">
          <el-form-item style="padding-left: 120px">
            <el-upload
              class="upload-demo"
              :action="uploadUrl"
              :headers="myHeaders"
              name="file"
              :on-error="uploadError"
              :on-success="uploadSuccess"
              :before-upload="beforeAvatarUpload"
              multiple
              drag
              :limit="1"
              :file-list="fileList">
              <i class="el-icon-upload"></i>
              <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em><br/>只能上传xlsx文件，且不超过10M</div>
            </el-upload>
          </el-form-item>
          <!--显示导入中错误的数据-->
          <div style="height: 200px;overflow-y: auto" v-if="hideTable">
            <custom-table
              :data="wrongDataList"
              :columns="detailColumns">
            </custom-table>
          </div>
          <div style="height: 200px" v-if="completeHideTable">
            <custom-table
              :data="completeWrongDataList"
              :columns="completeDetailColumns"
              :maxHeight="200">
            </custom-table>
          </div>
        </el-form>
      </div>
      <div slot="footer">
        <el-button type="primary" v-if="this.importBtnFlag === true" @click="uploadCancel()">确定</el-button>
      </div>
      <div slot="footer">
        <el-button type="warning" v-if="this.importBtnFlag === false" disabled>文件解析中，请勿关闭窗口</el-button>
      </div>
    </el-dialog>
    <!-- 受理工单模态框 -->
    <el-dialog :title="dialogType ==='add'? '创建受理工单':'编辑受理工单'" center :visible.sync="acceptFormVisible" wdith="80%"
               :close-on-click-modal="false">
      <!-- 受理工单表单 -->
      <el-form class="form-horizontal" :rules="acceptRules" :model="acceptOrderDto" label-width="120px"
               ref="acceptForm">
        <el-form-item label="受理日期" prop="acceptedTime">
          <el-input v-model="acceptOrderDto.acceptedTime" :disabled="true"></el-input>
        </el-form-item>
        <!-- 客户信息 -->
        <el-form-item label="客户姓名" prop="customerName">
          <el-row>
            <el-col :span="20">
              <el-input v-model.trim="acceptOrderDto.customerName" placeholder="请输入客户姓名"></el-input>
            </el-col>
            <el-col :span="4">
              <el-button type="primary" style="margin-left:5px;width:90%" @click="onSearch(0)">检索</el-button>
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="客户类型" prop="customerType">
          <el-select v-model="acceptOrderDto.customerType" placeholder="请选择客户类型">
            <el-option
              v-for="item in customerTypeOptions"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="联系电话" prop="tel">
          <el-input v-model.trim="acceptOrderDto.tel" auto-complete="off"></el-input>
        </el-form-item>
        <el-form-item label="客户所在地区">
          <el-row>
            <el-col :span="6">
              <el-input v-model="acceptOrderDto.province"
                        placeholder="请选择省份" :disabled="true"></el-input>
            </el-col>
            <el-col :span="6" prop="cityRule">
              <el-select v-model="acceptOrderDto.cityCode" clearable placeholder="请选择城市"
                         @change="getArea(acceptOrderDto.cityCode)">
                <el-option
                  v-for="item in allCity"
                  :key="item.code"
                  :label="item.name"
                  :value="item.code">
                </el-option>
              </el-select>
            </el-col>
            <el-col :span="6" prop="areaRule">
              <el-select v-model="acceptOrderDto.areaCode" clearable placeholder="请选择地区">
                <el-option
                  v-for="item in allArea"
                  :key="item.code"
                  :label="item.name"
                  :value="item.code">
                </el-option>
              </el-select>
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="客户详细地址" prop="address">
          <el-input v-model.trim="acceptOrderDto.address" placeholder="请输入客户详细地址"></el-input>
        </el-form-item>
        <!-- 产品信息 -->
        <el-form-item label="YSTSN" prop="ystsn">
          <el-row>
            <el-col :span="20">
              <el-input v-model.trim="acceptOrderDto.ystsn" placeholder="请输入YSTSN"
                        :disabled="this.dialogType !=='add'"></el-input>
            </el-col>
            <el-col :span="4">
              <el-button type="primary" style="margin-left:5px;width:90%" @click="onSearch(1)">检索</el-button>
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="品牌" prop="brandId">
          <el-select filterable v-model="acceptOrderDto.brandId" placeholder="请选择品牌" @change="brandChange()">
            <el-option
              v-for="item in brandOptions"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="型号" prop="modelId">
          <el-select filterable v-model="acceptOrderDto.modelId" placeholder="请选择型号">
            <el-option
              v-for="item in modelOptions"
              :key="item.id"
              :label="item.code"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="生产厂商" prop="factoryId">
          <el-select filterable v-model="acceptOrderDto.factoryId" placeholder="请选择生产厂商">
            <el-option
              v-for="item in factoryList"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="保修截止日期" prop="expirationDate">
          <el-date-picker
            v-model="acceptOrderDto.expirationDate"
            type="date"
            placeholder="选择日期"
            format="yyyy 年 MM 月 dd 日"
            value-format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="送修类型">
          <el-radio-group v-model.number="acceptOrderDto.repairType">
            <el-radio :label="0">送修</el-radio>
            <el-radio :label="1">寄修</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="接收物流单号" prop="logisticsNumber" v-if="acceptOrderDto.repairType === 1">
          <el-input v-model.trim="acceptOrderDto.logisticsNumber" auto-complete="off"></el-input>
        </el-form-item>
        <el-row>
          <el-col :span="3" style="margin-left: 10%">
            <el-button type="primary" @click="submit(1)" v-if="false">直接返厂</el-button>
          </el-col>
          <el-col :span="3" style="margin-left: 10%">
            <el-button type="success" @click="submit(0)">受理完成</el-button>
          </el-col>
          <el-col :span="3" style="margin-left: 10%">
            <el-button @click="cancel()">取消</el-button>
          </el-col>
        </el-row>
      </el-form>
      <!-- 根据客户名称检索到的客户信息或者检索到的产品信息 -->
      <el-dialog title="客户信息" height="300" center :visible.sync="dialogVisible"
                 append-to-body :close-on-click-modal="false">
        <!--检索结果-->
        <custom-table
          :columns="customerColumns"
          :data="customerData"
          :tableLoadingFlag="customerLoadingFlag"
          :operationColumn="customerOperationColumn"
          :pagination="customerPagination">
        </custom-table>
      </el-dialog>
    </el-dialog>
  </div>
</template>

<script>
  import CustomTable from '@/components/table/CustomTable'
  import {
    apiGetAcceptOrderList,
    apiExport,
    apiGetWarrantyDeviceInfo,
    apiGetAcceptOrder,
    apiDelAcceptOrder,
    apiAddAcceptOrder,
    apiUpdAcceptOrder,
    apiGetDeviceCurrentStatus
  } from '@/api/repairs/point/accept'
  import {
    apiGetModelList,
    apiGetCity,
    apiGetArea,
    apiGetFactoryList,
    apiGetAllPointOffice,
    apiGetOutsourcerByProvince
  } from '@/api/dictionary'
  import {baseInfo} from '@/utils/fetch'
  import {parseTime} from '@/utils'
  import {validatePhone} from '@/utils/validation'
  import Panel from '@/components/common/Panel'
  import {apiGetRepairCustomerList} from '@/api/basic/info/client'
  import {
    getRoleType,
    getOfficeProvince,
    getOutsourceProvince,
    getOfficeProvinceCode,
    getOutsourceProvinceCode,
    getOfficeId,
    getOfficeType,
    getOutsourceId,
    getOutsourceType,
    getName,
    getUserId
  } from '@/utils/token'
  import {apiAcceptReadExcel, apiAcceptCompleteReadExcel} from '@/api/excel/excelRead'
  import store from '@/store'
  import Const from '@/components/contants/repairInfo'
  import {downloadExcel} from "../../../utils";

  export default {
    components: {
      CustomTable,
      Panel
    },
    created () {
      // 初始数据查询
//      this.getAcceptOrderList(this.listQuery)
      // 初始化省份
      this.getSelectProvince()
      // 登录用户是省级办事处时，初始化地市
      if (this.roleType === '2' && this.officeType === '0') {
        this.searchDto.provinceCode = getOfficeProvinceCode()
        this.getSelectCity()
      } else if (this.roleType === '3' && getOutsourceType() === '1') {
        this.searchDto.provinceCode = getOutsourceProvinceCode()
        this.getSelectCity()
      }
      // 型号查询初始化
      this.selectedModelInit()
      this.getAllCity()
      this.getFactoryList()
      this.def()
      // 如果是省级办事处角色，则对查询范围初始化
      if (this.officeType === '0') {
        this.initRangeOptions(this.searchDto)
      }
      // 省份初始化
      this.getSelectProvince()
    },
    data () {
      return {
        // 解析message框实例名
        message: '',
        pointType: '',
        pointId: '',
        // 网点信息，由网点id和网点类型拼接组成,用","分隔
        pointInformation: (getRoleType() === '2' ? parseInt(getOfficeId()) : parseInt(getOutsourceId())) + ',0',
        // 导入上传url
        uploadUrl: baseInfo() + '/api/v1/upload',
        // 导入上传头部
        myHeaders: {'access_token': store.getters.token},
        // 上传文件显示
        fileList: [],
        // 文件上传路径
        importFileUrl: baseInfo() + '/api/v1/upload',
        // 文件上传参数
        upLoadData: {},
        // 工单维修状态
        options: Const.orderStatus,
        // 查询范围option 范围为自身办事处及该省内所有办事处、外包商
        rangeOptions: [],
        // 新增、修改表单时地市一览
        allCity: [],
        // 新增、修改表单时县级一览
        allArea: [],
        // 用户角色类型
        roleType: getRoleType(),
        // 办事处类型 0:省办事处，1:市办事处
        officeType: getOfficeType(),
        // 省外包商 1
        outSource: getOutsourceType(),
        // 型号查询条件一览
        changeModelOptions: [],
        // 模态框类型  add：新增
        dialogType: undefined,
        // 查询客户一览
        customerData: [],
        // 产品信息一览
        productColumns: [],
        // 客户信息对话框
        dialogVisible: false,
        // 产品信息对话框
        productDialogVisible: false,
        // 导入错误数据显示
        wrongDataList: [],
        completeWrongDataList: [],
        // 导入模态框显示
        uploadVisible: false,
        // 导入错误数据表显示
        hideTable: false,
        completeHideTable: false,
        // 生产厂商
        factoryList: [],
        // 受理模板导入(true),完整模板导入(false)
        completeFlag: true,
        // 客户类型查询条件一览
        customerTypeOptions: this.getCustomerTypeList(),
        // 品牌类型
        brandOptions: this.getBrandList(),
        // 型号选择
        modelOptions: [],
        // 新增工单dto
        acceptOrderDto: {
          acceptedTime: parseTime(new Date().getTime()),
          customerId: undefined,
          provinceCode: getRoleType() === '2' ? getOfficeProvinceCode() : getOutsourceProvinceCode(),
          cityCode: '',
          areaCode: '',
          province: getRoleType() === '2' ? getOfficeProvince() : getOutsourceProvince(),
          city: '',
          area: '',
          address: '',
          customerType: undefined,
          customerName: '',
          tel: undefined,
          ystsn: '',
          status: '',
          brandId: undefined,
          modelId: undefined,
          factoryId: undefined,
          expirationDate: undefined,
          repairType: 1,
          logisticsNumber: '',
          warrantyDevId: undefined,
          warrantyDevFlag: 1,
          pointId: '',
          pointType: ''
        },
        // 日期查询限制
        pickOption: {
          disabledDate (time) {
            return time.getTime() > Date.now()
          }
        },
        // 新增、修改工单检证规则
        acceptRules: {
          customerName: [
            {required: true, message: '请输入客户姓名', trigger: 'blur'},
            {max: 20, message: '长度不得超过20字符', trigger: 'blur'}
          ],
          customerType: [
            {type: 'number', required: true, message: '请选择客户类型', trigger: 'change'}
          ],
          tel: [
            {required: true, message: '请输入员工联系电话', trigger: 'blur'},
            {validator: validatePhone, trigger: 'blur'}
          ],
          cityRule: [
            {required: true, message: '请选择城市', trigger: 'change'}
          ],
          areaRule: [
            {required: true, message: '请选择地区', trigger: 'change'}
          ],
          address: [
            {required: true, message: '请输入详细地址', trigger: 'blur'},
            {max: 255, message: '长度不超过 255 个字符', trigger: 'blur'}
          ],
          ystsn: [
            {required: true, message: '请输入SN号', trigger: 'blur'},
            {max: 32, message: '长度不超过 32 个字符', trigger: 'blur'}
          ],
          brandId: [
            {type: 'number', required: true, message: '请选择品牌', trigger: 'change'}
          ],
          logisticsNumber: [
            {required: true, message: '请输入接收物流单号', trigger: 'blur'},
            {max: 255, message: '长度不得超过255字符', trigger: 'blur'}
          ]
        },
        // 新增、修改模态框标记
        acceptFormVisible: false,
        // 受理工单等待加载
        tableLoadingFlag: false,
        // 客户信息加载
        customerLoadingFlag: false,
        // 收单一览属性显示
        columns: [
          {label: 'ID', name: 'id', width: '80', align: 'center'},
          {label: '受理工单代码', name: 'acceptedCode', width: '160', align: 'center'},
          {label: '客户所在省份', name: 'province', width: '120', align: 'center'},
          {label: '客户所在地市', name: 'city', width: '120', align: 'center'},
          {label: '客户姓名', name: 'customerName', width: '80', align: 'center'},
          {label: '客户类型', name: 'customerType', width: '80', align: 'center'},
          {label: '联系电话', name: 'tel', width: '120', align: 'center'},
          {label: '服务类型', name: 'serviceTypeName', width: '100', align: 'center'},
          {label: '故障类型', name: 'faultTypeName', width: '100', align: 'center'},
          {label: '状态', name: 'statusName', width: '80', align: 'center'},
          {label: '型号', name: 'modelName', width: '180', align: 'center'},
          {label: 'YSTSN', name: 'ystsn', width: '200', align: 'center'},
          {label: 'STBID', name: 'stbId', width: '200', align: 'center'},
          {label: '品牌', name: 'brandName', width: '120', align: 'center'},
          {label: '受理日期', name: 'acceptedTime', width: '180', align: 'center', formatter: this.formatTime}
        ],
        // 受理导入错误详情属性
        detailColumns: [
          {label: '错误行号', name: 'wrongRowNO', width: '77', height: '40', align: 'center'},
          {label: '错误原因', name: 'reason', width: '120', height: '40', align: 'center'},
          {label: '客户姓名', name: 'customerName', width: '120', height: '40', align: 'center'},
          {label: '客户类型', name: 'customerType', width: '120', height: '40', align: 'center'},
          {label: '客户详细地址', name: 'address', width: '120', height: '40', align: 'center'},
          {label: '联系电话', name: 'tel', width: '120', height: '40', align: 'center'},
          {label: '省份', name: 'province', width: '120', height: '40', align: 'center'},
          {label: '城市', name: 'city', width: '120', height: '40', align: 'center'},
          {label: '地区', name: 'area', width: '120', height: '40', align: 'center'},
          {label: 'YSTSN', name: 'ystsn', width: '120', height: '40', align: 'center'},
          {label: '品牌', name: 'brand', width: '120', height: '40', align: 'center'},
          {label: '型号', name: 'model', width: '120', height: '40', align: 'center'},
          {label: '生产厂商', name: 'factory', width: '120', height: '40', align: 'center'},
          {label: '保修截止日期', name: 'expirationDate', width: '120', height: '40', align: 'center'},
          {label: '送修类型', name: 'repairType', width: '120', height: '40', align: 'center'},
          {label: '接收物流单号', name: 'logisticsNumber', width: '120', height: '40', align: 'center'}
        ],
        // 完整导入错误详情属性
        completeDetailColumns: [
          {label: '错误行号', name: 'wrongRowNO', width: '77', height: '40', align: 'center'},
          {label: '错误原因', name: 'reason', width: '120', height: '40', align: 'center'},
          {label: '故障类型', name: 'faultType', width: '120', height: '40', align: 'center'},
          {label: '故障现象', name: 'faultAppearance', width: '120', height: '40', align: 'center'},
          {label: '故障处理方式', name: 'faultTreatment', width: '120', height: '40', align: 'center'},
          {label: '维修结果', name: 'repairResult', width: '120', height: '40', align: 'center'},
          {label: '备机YSN', name: 'newYstsn', width: '120', height: '40', align: 'center'},
          {label: '客户姓名', name: 'customerName', width: '120', height: '40', align: 'center'},
          {label: '客户类型', name: 'customerType', width: '120', height: '40', align: 'center'},
          {label: '客户详细地址', name: 'address', width: '120', height: '40', align: 'center'},
          {label: '联系电话', name: 'tel', width: '120', height: '40', align: 'center'},
          {label: '省份', name: 'province', width: '120', height: '40', align: 'center'},
          {label: '城市', name: 'city', width: '120', height: '40', align: 'center'},
          {label: '地区', name: 'area', width: '120', height: '40', align: 'center'},
          {label: 'SN号', name: 'ystsn', width: '120', height: '40', align: 'center'},
          {label: 'STBID', name: 'stbId', width: '120', height: '40', align: 'center'},
          {label: '品牌', name: 'brand', width: '120', height: '40', align: 'center'},
          {label: '型号', name: 'model', width: '120', height: '40', align: 'center'},
          {label: '生产厂商', name: 'factory', width: '120', height: '40', align: 'center'},
          {label: '保修截止日期', name: 'expirationDate', width: '120', height: '40', align: 'center'},
          {label: '送修类型', name: 'repairType', width: '120', height: '40', align: 'center'},
          {label: '接收物流单号', name: 'logisticsNumber', width: '120', height: '40', align: 'center'}
        ],
        // 客户选择属性
        customerColumns: [
          {label: 'ID', name: 'id', width: '60', align: 'center'},
          {label: '客户姓名', name: 'customerName', width: '120', align: 'center'},
          {label: '电话', name: 'tel', width: '130', align: 'center'},
          {label: '省', name: 'province', width: '120', align: 'center'},
          {label: '市', name: 'city', width: '80', align: 'center'},
          {label: '区', name: 'area', width: '80', align: 'center'},
          {label: '详细地址', name: 'address', width: '200', align: 'center'}
        ],
        // 操作栏
        operationColumn: {
          width: '120',
          operations: [
            {name: '编辑', callback: this.handleEdit, page: 'accepts'},
            {name: '删除', callback: this.handleDel, page: 'accepts'}
          ]
        },
        // 客户选择操作栏
        customerOperationColumn: {
          width: '100',
          operations: [
            {name: '选择', callback: this.checkIt}
          ]
        },
        // table数据一览
        acceptOrderList: [],
        // 分页组件
        pagination: this.getData(this.getAcceptOrderList),
        // 客户分页
        customerPagination: this.getData(this.getCustomerList),
        // 列表查询dto
        searchDto: {
          customerType: '',
          customerName: '',
          status: '',
          roleType: this.roleType,
          provinceCode: '', // 省份代码
          cityCode: '', // 城市代码
          modelId: '', // 型号id
          YSTSN: '',
          STBID: '',
          dateSearch: ''
        },
        // 所有省份一览选择
        allSelectProvince: [],
        // 城市一览选择
        allSelectCity: [],
        // 条件查询
        listQuery: {
          pageNumber: 1,
          pageSize: 10
        },
        // 新增、导入标记，为true时允许导入
        orderFlag: true,
        // 数据导入 为true时允许导入
        baseorderFlag: true,
        // 导入受理模态框按钮标志，为true时显示确认按钮
        importBtnFlag: true
      }
    },
    methods: {
      searchDeviceStatus (ystsn) {
        apiGetDeviceCurrentStatus(ystsn).then(response => {
          if (response.data) {
            this.$message({
              type: 'success',
              dangerouslyUseHTMLString: true,
              message: '设备：' + ystsn + '正处在 <span style="font-weight: bold">' + response.data + '</span> 状态',
              showClose: true
            })
          } else {
            this.$message({
              type: 'info',
              message: '设备：' + ystsn + '目前没有未完结的工单',
              showClose: true
            })
          }
        }).catch()
      },
      // 查询范围初始化(省级办事处拥有查询范围选择权限，范围为自身办事处及该省内所有办事处、外包商)
      initRangeOptions (listquery) {
        let listQuery = {
          province: listquery.provinceCode,
          city: ''
        }
        // 获取该省下所有办事处
        apiGetAllPointOffice(listQuery).then(response => {
          let rangeOption = []
          let officeList = response.data
          let i = 0
          for (i; i < officeList.length; i++) {
            rangeOption.value = officeList[i].id + ',0'
            rangeOption.label = officeList[i].name
            this.rangeOptions.push(rangeOption)
            rangeOption = []
          }
        })
        // 获取该省下所有外包商
        apiGetOutsourcerByProvince(listQuery).then(response => {
          let rangeOption = []
          let outsourcerList = response.data
          let i = 0
          for (i; i < outsourcerList.length; i++) {
            rangeOption.value = outsourcerList[i].id + ',1'
            rangeOption.label = outsourcerList[i].company
            this.rangeOptions.push(rangeOption)
            rangeOption = []
          }
        })
      },
      // 上传成功后的回调
      uploadSuccess (response) {
        this.message = this.$message({
          type: 'warning',
          duration: 0,
          message: '文件解析中，请勿关闭窗口!'
        })
        if (this.completeFlag) {
          let uploadDto = {
            filePath: response.data,
            pointId: this.pointId
          }
          this.excelRead(uploadDto)
        } else {
          let uploadDto = {
            pointId: this.pointId,
            pointType: this.pointType,
            filePath: response.data,
            userId: getUserId(),
            operator: getName(),
            provinceCode: getRoleType() === '2' ? getOfficeProvinceCode() : getOutsourceProvinceCode()
          }
          this.excelReadComplete(uploadDto)
        }
        this.importBtnFlag = false
      },
      // 上传错误
      uploadError () {
        this.$message({
          showClose: true,
          message: '上传失败，请重试！'
        })
      },
      // 上传前对文件的大小的判断
      beforeAvatarUpload (file) {
        let fileNameArr = file.name.split('.')
        let extension = fileNameArr[fileNameArr.length - 1] === 'xlsx'
        let isLt2M = file.size / 1024 / 1024 < 10
        if (!extension) {
          this.$message({
            showClose: true,
            message: '上传模板只能是 xlsx 格式!'
          })
        }
        if (!isLt2M) {
          this.$message({
            showClose: true,
            message: '上传模板大小不能超过 10MB!'
          })
        }
        return extension && isLt2M
      },
      // excel导入
      excelRead (uploadDto) {
        apiAcceptReadExcel(uploadDto).then(response => {
          if (response.data) {
            this.wrongDataList = response.data
            this.hideTable = true
          } else {
            this.$message({
              showClose: true,
              message: '受理成功!',
              type: 'success'
            })
            this.hideTable = false
            this.getAcceptOrderList({
              pageNumber: this.pagination.currentPage,
              pageSize: this.pagination.pageSize
            })
          }
          this.fileList = []
        })
      },
      // 受理完整模板导入
      excelReadComplete (uploadDto) {
        apiAcceptCompleteReadExcel(uploadDto).then(response => {
          if (response.data) {
            this.completeWrongDataList = response.data
            this.completeHideTable = true
            this.importBtnFlag = true
            if (this.completeWrongDataList.length > 0) {
              this.$message({
                message: '导入数据存在错误',
                showClose: true,
                type: 'error'
              })
            }
          } else {
            this.$message({
              showClose: true,
              message: '受理成功!',
              type: 'success'
            })
            this.importBtnFlag = true
            this.completeHideTable = false
            this.getAcceptOrderList({
              pageNumber: this.pagination.currentPage,
              pageSize: this.pagination.pageSize
            })
          }
          this.fileList = []
          this.message.close()
        }).catch(() => {
          this.message.close()
        })
      },
      // 数据导出
      excelExport () {
        let listQuery = {}
        listQuery.customerName = this.searchDto.customerName
        listQuery.customerType = this.searchDto.customerType
        listQuery.status = this.searchDto.status
        listQuery.modelId = this.searchDto.modelId
        if (getRoleType() === '2' && this.searchDto.provinceCode === '') {
          this.searchDto.provinceCode = getOfficeProvinceCode()
        }
        if (getRoleType() === '3' && this.searchDto.provinceCode === '') {
          this.searchDto.provinceCode = getOutsourceProvinceCode()
        }
        listQuery.provinceCode = this.searchDto.provinceCode
        listQuery.cityCode = this.searchDto.cityCode
        listQuery.ystsn = this.searchDto.YSTSN
        listQuery.stbId = this.searchDto.STBID
        listQuery.dateSearch = this.searchDto.dateSearch
        if (this.roleType === '2' && this.officeType === '0') {
          listQuery.officeType = 0
        } else {
          listQuery.officeType = 1
        }
        listQuery.pointInformation = this.pointInformation
        apiExport(listQuery).then(response => {
          downloadExcel(response.data, '自有售后网点受理工单信息导出表')
        }).catch(() => {
        })
      },
      // 下拉菜单回调事件
      handleCommand (command) {
        if (command === 'handleImport') {
          this.dialogType = 'upload'
          this.uploadVisible = true
        } else if (command === 'handleDownload') {
        } else if (command === 'handleImportComplete') {
          this.dialogType = 'upload'
          this.uploadVisible = true
          this.completeFlag = false
        }
      },
      // 导入模态框关闭事件
      uploadCancel () {
        this.uploadVisible = false
        this.wrongDataList = []
        this.fileList = []
        this.hideTable = false
        this.completeHideTable = false
        this.$refs['uploadForm'].resetFields()
      },
      // 新增、修改表单获取所有地市
      getAllCity () {
        let listQuery = {
          province: getRoleType() === '2' ? getOfficeProvinceCode() : getOutsourceProvinceCode()
        }
        apiGetCity(listQuery).then(response => {
          this.allCity = response.data
        })
      },
      // 新增、修改表单获取所有县级
      getArea (vId) {
        this.acceptOrderDto.areaCode = ''
        if (this.acceptOrderDto.cityCode === '') {
          this.allArea = []
        } else {
          let listQuery = {
            city: this.acceptOrderDto.cityCode
          }
          this.getAreaList(listQuery)
        }
        // 获取城市名
        let obj = {}
        obj = this.allCity.find((item) => {
          return item.code === vId
        })
        this.acceptOrderDto.city = obj.name
      },
      def () {
        if (this.roleType === '2' || this.roleType === '3') {
          this.orderFlag = true
          this.baseorderFlag = true
          if (this.roleType === '2') {
            this.pointType = 0
            this.pointId = getOfficeId()
          } else {
            this.pointType = 1
            this.pointId = getOutsourceId()
          }
        } else {
          this.orderFlag = false
          this.operationColumn = null
        }
        if (this.roleType === '1') {
          this.baseorderFlag = true
        }
      },
      // 型号选择初始化
      selectedModelInit () {
        apiGetModelList().then(response => {
          this.changeModelOptions = response.data
        }).catch(() => {
          this.tableLoadingFlag = false
        })
      },
      getModelList (brandId) {
        apiGetModelList(brandId).then(response => {
          this.modelOptions = response.data
        })
      },
      // 是否同意维修
      isRepairChange () {
        if (this.repairOrderDto.isRepair === '1') {
          this.repairOrderDto.repairStatus = 3     // 原物返还
        } else {
          this.repairOrderDto.repairStatus = ''
        }
      },
      // 是否同意支付
      paymentChange () {
        if (this.repairOrderDto.isPayment === '1') {  // 不同意支付
          this.repairOrderDto.repairStatus = 1     // 待修复
        } else {
          this.repairOrderDto.repairStatus = ''
        }
      },
      // 新增受理工单
      handleAdd () {
        this.dialogType = 'add'
        if (this.$refs['acceptForm']) {
          this.acceptOrderDto = {
            acceptedTime: parseTime(new Date().getTime()),
            customerId: undefined,
            cityCode: '',
            areaCode: '',
            address: '',
            province: getRoleType() === '2' ? getOfficeProvince() : getOutsourceProvince(),
            provinceCode: getRoleType() === '2' ? getOfficeProvinceCode() : getOutsourceProvinceCode(), // 接口不需要
            city: '', // 接口不需要
            area: '',
            customerType: undefined,
            customerName: '',
            tel: undefined,
            ystsn: '',
            brandId: undefined,
            modelId: undefined,
            factoryId: undefined,
            expirationDate: '',
            repairType: 1,
            logisticsNumber: ''
          }
          this.$refs['acceptForm'].resetFields()
        }
        this.acceptFormVisible = true
      },
      // 获取受理工单一览
      getAcceptOrderList (listQuery) {
        this.tableLoadingFlag = true
        this.listQuery.customerName = this.searchDto.customerName
        this.listQuery.customerType = this.searchDto.customerType
        this.listQuery.status = this.searchDto.status
        this.listQuery.modelId = this.searchDto.modelId
        if (getRoleType() === '2' && this.searchDto.provinceCode === '') {
          this.searchDto.provinceCode = getOfficeProvinceCode()
        }
        if (getRoleType() === '3' && this.searchDto.provinceCode === '') {
          this.searchDto.provinceCode = getOutsourceProvinceCode()
        }
        this.listQuery.provinceCode = this.searchDto.provinceCode
        this.listQuery.cityCode = this.searchDto.cityCode
        this.listQuery.YSTSN = this.searchDto.YSTSN
        this.listQuery.STBID = this.searchDto.STBID
        this.listQuery.dateSearch = this.searchDto.dateSearch
        this.listQuery.pointInformation = this.pointInformation
        if (listQuery !== undefined) {
          this.listQuery.pageNumber = listQuery.pageNumber
          this.listQuery.pageSize = listQuery.pageSize
        }
        apiGetAcceptOrderList(this.listQuery).then(response => {
          this.acceptOrderList = response.data
          this.pagination.totalRecords = response.totalRecords
          this.tableLoadingFlag = false
        }).catch(() => {
          this.tableLoadingFlag = false
        })
      },
      // 客户选择
      checkIt (row) {
        this.customerInfo = row.customerName + '' + row.id + '' + row.customerType + '' + row.tel + '' + row.province + '' + row.city + '' + row.area + '' + row.address
        var newName = row.customerName
        this.acceptOrderDto.customerName = newName
        this.acceptOrderDto.customerId = row.id
        this.acceptOrderDto.customerType = row.customerType
        this.acceptOrderDto.tel = row.tel
        let listQuery = {
          city: row.cityCode
        }
        this.getAreaList(listQuery)
        this.acceptOrderDto.province = row.province
        this.acceptOrderDto.city = row.city
        this.acceptOrderDto.area = row.area
        this.acceptOrderDto.provinceCode = row.provinceCode
        this.acceptOrderDto.cityCode = row.cityCode
        this.acceptOrderDto.areaCode = row.areaCode
        this.acceptOrderDto.address = row.address
        this.dialogVisible = false
      },
      // 获取生产厂商
      getFactoryList () {
        var listQuery = {
          factoryType: 0
        }
        apiGetFactoryList(listQuery).then(response => {
          this.factoryList = response.data
        }).catch(() => {
          this.$message({showClose: true, message: '获取生产工厂列表失败', type: 'error'})
        })
      },
      // 品牌改变时型号的修改
      brandChange () {
        this.acceptOrderDto.modelId = ''
        apiGetModelList({brandId: this.acceptOrderDto.brandId}).then(response => {
          this.modelOptions = response.data
        })
      },
      // 获取客户信息一览
      getCustomerList (listQuery) {
        this.clearListQuery()
        if (listQuery !== undefined) {
          this.listQuery.pageNumber = listQuery.pageNumber
          this.listQuery.pageSize = listQuery.pageSize
        }
        this.listQuery.name = this.acceptOrderDto.customerName
        apiGetRepairCustomerList(this.listQuery).then(response => {
          this.customerData = response.data
          this.customerPagination.totalRecords = response.totalRecords
        }).catch(() => {
          this.$message({showClose: true, message: '查询客户信息失败', type: 'error'})
        })
      },
      // 检索
      onSearch (type) {
        if (type === 0) {
          // 检索客户信息
          if (this.acceptOrderDto.customerName === '') {
            this.$message({showClose: true, message: '请输入客户姓名', type: 'error'})
          } else {
            this.dialogVisible = true
            this.getCustomerList()
          }
        } else if (type === 1) {
          // 检索产品信息
          if (this.acceptOrderDto.ystsn === '') {
            this.$message({showClose: true, message: '请输入SN号', type: 'error'})
          } else {
            let listQuery = {
              ystsn: this.acceptOrderDto.ystsn
            }
            apiGetWarrantyDeviceInfo(listQuery).then(response => {
              if (response.resCode === '200') {
                var warrantyDev = response.data
                this.acceptOrderDto.factoryId = warrantyDev.factoryId
                this.acceptOrderDto.brandId = warrantyDev.brandId
                this.acceptOrderDto.ystsn = warrantyDev.ystsn
                this.acceptOrderDto.expirationDate = warrantyDev.expirationDate
                this.acceptOrderDto.warrantyDevId = warrantyDev.id
                this.getModelList(warrantyDev.brandId)
                this.acceptOrderDto.modelId = warrantyDev.modelId
                this.warrantyDevInfo = warrantyDev.brandId + '' + warrantyDev.modelId + '' + warrantyDev.factoryId + '' +
                  warrantyDev.ystsn + '' + warrantyDev.expirationDate
              } else {
                this.$message({showClose: true, message: '未检索到该YSTSN信息，请自行判定', type: 'error'})
              }
            }).catch(() => {
            })
          }
        } else {
          // 检索产品信息
          this.productDialogVisible = true
          var searchYstsn = this.acceptOrderDto.ystsn
          let listQuery = {ystsn: searchYstsn}
          apiGetRepairCustomerList(listQuery).then(response => {
            this.productColumns = response.data
          }).catch(() => {
            this.productColumns = []
          })
        }
      },
      // 新增、修改表单提交
      submit (nextFlag) {
        this.$refs['acceptForm'].validate((valid) => {
          if (valid) {
            if (this.dialogType === 'add') {
              this.addSubmit(nextFlag)
            } else {
              this.updSubmit(nextFlag)
            }
          } else {
            return false
          }
        })
      },
      // 添加工单
      addSubmit (nextFlag) {
        let newCustomerInfo = this.acceptOrderDto.customerName + '' + this.acceptOrderDto.customerId + '' + this.acceptOrderDto.customerType + '' + this.acceptOrderDto.tel + '' + this.acceptOrderDto.province + '' + this.acceptOrderDto.city + '' + this.acceptOrderDto.area + '' + this.acceptOrderDto.address
        let newWarrantyDevInfo = this.acceptOrderDto.brandId + '' + this.acceptOrderDto.modelId + '' + this.acceptOrderDto.factoryId + '' +
          this.acceptOrderDto.ystsn + '' + this.acceptOrderDto.expirationDate
        if (this.acceptOrderDto.warrantyDevId !== undefined && this.warrantyDevInfo !== newWarrantyDevInfo) {
          this.acceptOrderDto.warrantyDevFlag = 0
        }
        if (this.acceptOrderDto.warrantyDevFlag === undefined) {
          this.acceptOrderDto.warrantyDevFlag = 1
        }
        if (newCustomerInfo !== this.customerInfo && this.customerInfo !== '') {
          this.$confirm('客户信息已经发生变化?', '客户信息发生变化', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.customerInfo = ''
            apiAddAcceptOrder(this.acceptOrderDto).then(response => {
              if (response.resCode === '200') {
                this.$message({
                  showClose: true,
                  message: '新增成功',
                  type: 'success'
                })
                this.cancel('acceptForm', nextFlag)
                this.getAcceptOrderList()
              } else {
                this.$message({
                  showClose: true,
                  message: response.data.message,
                  type: 'error'
                })
              }
            })
          })
        } else {
          apiAddAcceptOrder(this.acceptOrderDto).then(response => {
            if (response.resCode === '200') {
              this.$message({
                showClose: true,
                message: '新增成功',
                type: 'success'
              })
              this.nextId = response.id
              this.cancel('acceptForm', nextFlag)
              this.getAcceptOrderList()
            } else {
              this.$message({
                showClose: true,
                message: response.data.message,
                type: 'error'
              })
            }
          })
        }
      },
      // 修改工单
      updSubmit (nextFlag) {
        this.acceptOrderDto.pointId = this.pointId
        this.acceptOrderDto.pointType = this.pointType
        apiUpdAcceptOrder(this.acceptOrderDto).then(() => {
          this.$message({
            showClose: true,
            message: '编辑成功',
            type: 'success'
          })
          this.cancel('acceptForm', nextFlag)
        })
      },
      // 模态框取消按钮
      cancel (formName, nextFlag) {
        if (nextFlag === 1) {
          this.acceptFormVisible = false
          // this.$router.push({path: '/repairs/point/repair/add/' + row.deId})
        } else {
          if (nextFlag === 3) {
            this.repairFormVisible = false
          }
          this.acceptFormVisible = false
          this.getAcceptOrderList({pageNumber: this.pagination.currentPage, pageSize: this.pagination.pageSize})
          if (this.$refs[formName] !== undefined) {
            this.$refs[formName].resetFields()
          }
        }
      },
      // 时间显示格式化
      formatTime (row, column, cellValue) {
        return parseTime(cellValue)
      },
      // 查询条件初始化
      clearListQuery () {
        this.listQuery = {
          pageNumber: 1,
          pageSize: 10
        }
      },
      // 获取当前省份下所有城市一览
      getSelectCity () {
        this.searchDto.cityCode = ''
        if (this.searchDto.provinceCode === '') {
          this.allSelectCity = []
        } else {
          let listQuery = {
            province: this.searchDto.provinceCode
          }
          apiGetCity(listQuery).then(response => {
            this.allSelectCity = response.data
          })
        }
      },
      // 获取所有省份一览
      getSelectProvince () {
        apiGetCity().then(response => {
          this.allSelectProvince = response.data
        })
      },
      // 获取地区一览
      getAreaList (listQuery) {
        apiGetArea(listQuery).then(response => {
          this.allArea = response.data
        })
      },
      // 工单编辑
      handleEdit (row) {
        this.nextId = row.id
        this.dialogType = 'edit'
        apiGetAcceptOrder(row.id).then(response => {
          this.acceptOrderDto = response.data
          this.acceptOrderDto.acceptedTime = parseTime(this.acceptOrderDto.acceptedTime)
          this.getModelList({brandId: response.data.brandId})
          let listQuery = {
            city: response.data.cityCode
          }
          this.getAreaList(listQuery)
        })
        this.acceptFormVisible = true
      },
      // 工单删除
      handleDel (row) {
        this.$confirm('确定删除该条工单信息?', '删除受理工单', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          var that = this
          apiDelAcceptOrder(row.id).then(() => {
            this.$message({
              showClose: true,
              type: 'success',
              message: '删除成功!'
            })
            this.getAcceptOrderList({pageNumber: that.pagination.currentPage, pageSize: that.pagination.pageSize})
          })
        })
      }
    }
  }
</script>
